<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>Syudeon</title>
		<link rel="stylesheet" type="text/css" href="css/base.css"/>
		<link rel="stylesheet" type="text/css" href="css/index.css"/>
		<link rel="stylesheet" type="text/css" href="css/contact.css"/>
	</head>
	<body>
		<!--header区-->
		
		<header>
		    <div class="w clearfix">
		        <div class="logo fl"><img src="images/logo.png"></div>
		        <ul class="nav fl clearfix">
		            <li class="fl"><a href="index.html">Home</a></li>
		            <li class="fl"><a href="#">About</a></li>
		            <li class="fl"><a href="#">Portfolio</a></li>
		            <li class="fl features"><a href="features.html">Features</a>
		                <ul class="subnav">
		                    <li><a href="#">Typography</a></li>
		                    <li><a href="#">Shortcodes</a></li>
		                    <li><a href="#">Columns</a></li>
		                    <li><a href="#">Pricing Plans</a></li>
		                    <li><a href="#">Alerts</a></li>
		                    <li><a href="#">Services</a></li>
		                </ul>
		            </li>
		            <li class="fl"><a href="blog.html">Blog</a></li>
		            <li class="fl"><a href="contact.html">Contact</a></li>
		        </ul>
		        <div class="icons">
		            <div class="icon fl"></div>
		            <div class="icon fl"></div>
		            <div class="icon fl"></div>
		            <div class="icon fl"></div>
		            <div class="icon fl"></div>
		            <div class="icon fl"></div>
		        </div>
		    </div>
		</header>
		<main style=" padding-top: 150px;  height: 680PX;">
			<div class="w" >
				<h1>CONTACT US</h1>
				<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur,Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean ligula eget dolor.
				 Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes.</p>
				<!-- <table border="2" cellspacing="3" cellpadding="4">
				 	<td ><input type="text" value="Name"></td>
					<td ><input type="emai
					l" value="email"></td>
					<td><input type="text" value="Subject"></td>
				 </table> -->
				<div style="height: 50px; margin-top: 30px;">
					<div class="fl" style="width: 365px; height: 50px; border: 1px solid #dcdbe0; border-radius: 2%; margin-left: 6px; background-color: #ededed;"><input type="text" name="" id="" value="Name" style="line-height: 50px; font-size: 24px;background-color: #ededed;color:#a9a9a9;"/></div>
					<div class="fl" style="width: 365px; height: 50px; border: 1px solid #dcdbe0; margin-left: 10px; margin-right: 12px;background-color: #ededed;"><input type="email" name="" id="" value="Email" style="line-height: 50px; font-size: 24px;background-color: #ededed;color:#a9a9a9;"/></div>
					<div class="fl" style="width: 365px; height: 50px; border: 1px solid #dcdbe0;background-color: #ededed;"><input type="text" name="" id="" value="Subject" style="line-height: 50px; font-size: 24px;background-color: #ededed;color:#a9a9a9;"/></div>
				</div>
				  <div style="margin-top: 50px; margin-bottom: 50px;">
					<textarea rows="9" cols="92" type="text" style="font-size: 24px; color:#a9a9a9; background-color: #ededed;text-align: left;">
				    Message
					</textarea>
				  </div>
				<div style="padding-left: 460px;">
					<button style="font-size: 12px; color: #ffffff;background-color: #ec5743;line-height: 57px; width:255px; ;">SEND MESSAGE</button>
				</div>
			</div>
			
		</main>
		
		<!--footer区-->
		<footer>
		    <div class="footer_top clearfix w">
		        <div class="footer_top_1 fl">
		            <h7>ABOUT STUDEON</h7>
		            <div class="footer_line"></div>
		            <p8>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque id arcu neque, at convallis est felis.</p8>
		            <p9>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque id arcu neque, at convallis est felis.</p9>
		        </div>
		        <div class="footer_top_2 fl">
		            <h8>THE TAGS</h8>
		            <div class="footer_line"></div>
		            <div class="footer_top_2_label">
		                <li class="fl"><a href="#">Awesome</a></li>
		                <li class="fl"><a href="#">Strategy</a></li>
		                <li class="fl"><a href="#">Photography</a></li>
		                <li class="fl"><a href="#">Development</a></li>
		                <li class="fl"><a href="#">Css</a></li>
		                <li class="fl"><a href="#">photoshop</a></li>
		                <li class="fl"><a href="#">Html</a></li>
		                <li class="fl"><a href="#">Awesome</a></li>
		                <li class="fl"><a href="#">Strategy</a></li>
		                <li class="fl"><a href="#">Photoshop</a></li>
		                <li class="fl"><a href="#">Html</a></li>
		            </div>
		        </div>
		        <div class="footer_top_3 fl">
		            <h9>LATEST TWEETS</h9>
		            <div class="footer_line"></div>
		            <div class="tw">
		                <div class="tw_1">
		                    <div class="tw_logo"></div>
		                    <p11>I like this awesome freebie. Check it out <a href="#">@http://t.co/9vslJFpW</a></p11>
		                    <h10>ABOUT 15 MINS</h10>
		                </div>
		                <div class="tw_2">
		                    <div class="tw_logo"></div>
		                    <p12>I like this awesome freebie. Check it out <a href="#">@http://t.co/9vslJFpW</a></p12>
		                    <h11>ABOUT 15 MINS</h11>
		                </div>
		            </div>
		        </div>
		        <div class="footer_top_4 fr">
		            <h10>FLICKR FEED</h10>
		            <div class="footer_line"></div>
		            <div class="footer_top_4_p">
		                <div class="fl"></div>
		                <div class="fl"></div>
		                <div class="fl"></div>
		                <div class="fl"></div>
		                <div class="fl"></div>
		                <div class="fl"></div>
		            </div>
		        </div>
		    </div>
		    <div class="footer_bootem">
		        <div class="footer_bootem_w w">
		            <div class="footer_bootem_p1"></div>
		            <p7 class="fr">Copyright © 2015 All rights Reserved | Template by  <span>W3layouts</span></p7>
		        </div>
		        <div class="footer_bootem_p2 fr"></div>
		    </div>
		</footer>
	</body>
</html>
